<template>
	<view class="box">
		<view class="wexin" v-for="(item,index) in titList" :key="index">
			<view class="wexin_left">
				<image :src="item.taskImg" mode=""></image>
			</view>
			
			<view class="wexin_right">
				<view class="content">{{item.taskTitle}}</view>
				<view class="number">{{item.updateTime}}</view>
			</view>
			
		</view>
		
		<view class="noList" v-show="total == 0">
			<image src="../../static/img/yuncang/cloud_no_order.png" mode=""></image>
			<view class="text">暂无内容</view>
		</view>
		
				
		
		<view class="btn">
			<button @click="upload" >上传任务</button>
		</view>
		
	</view>
</template>
<script>

	export default {

		data() {
			return {
				taskType:"",
				titList:"",
				total:"",
			}
		},

		onLoad(options) {
			let id = options.taskType
			this.taskType = id;
			this.loadData(id)
			
			let title = "微信朋友圈分享"
			if (options.taskType == 2) {
				title = '小红书种草'
			}else if(options.taskType == 3){
				title = '天猫/淘宝（网店）刷评'
			}
			
			uni.setNavigationBarTitle({
				title
			})
			
			
		},
		
		//下拉刷新
		onPullDownRefresh() {
			
		},
		
		//加载更多
		onReachBottom() {
			
		},
		

		methods: {
			upload(){
				uni.navigateTo({
					url: `/pages/user/upload?taskType=${this.taskType}`
				})
			},
			loadData(id) {
				this.tui.request('/app/tasks/list', 'GET', {
					taskType:id,
					page:"2",
				}, false, false, false, )
					.then(res => {
						if (res.errno == 0) {
							this.titList = res.data.list
							this.total = res.data.total
						} else {
			
						}
			
					})
			},
		}
	}
</script>
<style lang='scss'>
	page{
		width: 100%;
		height: 100%;
		background-color: #FAFAFA;
	}
	.box{
		height: 100%;
		position: relative;
		
		
		.wexin{
			display: flex;
			width: 90%;
			margin: 0 auto;
			border-bottom: 1px solid #F2F2F2;
			padding-top: 10px;
			padding-bottom: 10px;
			
			.wexin_left{
				
				border-radius:8px;
				
				image{
					width:100px;
					height:100px;
				}
			}	
			
			.wexin_right{
				color: #333333;
				font-size: 32upx;
				padding-top: 8px;
				padding-left: 10px;
				line-height: 24px;
				
				.content{
					overflow : hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;
				}
				.number{
					color: #999999;
					font-size: 24upx;
				}
			}
		}
	}	
	
	/* 按钮 */
	.btn {
		width: 90%;
		margin: 10px auto;
		position: absolute;
		bottom: 0;
		right: 5%;
	}
	
	.btn button {
		margin-top: 20rpx;
		height: 88rpx;
		width: 100%;
		line-height: 88rpx;
		color: #ffffff;
		font-size: 32rpx;
		border-radius: 44rpx;
		outline: 0;
		display: block;
		margin: 0;
		font-family: inherit;
		background: #D14798;
		opacity: 0.8;
	}
	
	button:after {
		border: 2rpx solid #f2f2f2;
	}
	
	.noList{
		position: relative;
		
		
		
		image{
			position: absolute;
			top: 200upx;
			left: 28%;
			width: 280upx;
			height: 240upx;
		}
		
		
		.text{
			position: absolute;
			top: 460upx;
			left: 40%;
			color: #D14798;
		}
		
		
	}
</style>
